const { defineConfig } = require('@vue/cli-service');
const path = require('path');

module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    port: 9528,
    // open: true,
    proxy: {
      '/api': {
        target: 'http://127.0.0.1:8082', //设置调用接口地址和端口号别忘了加http
        changeOrigin: true,
        pathRewrite: {
          '^/api': '/', //这里理解成用‘/api’代替target里面的地址，组件中我们调接口时直接用/api代替
          // 比如我要调用'http://0.0:300/user/add'，直接写‘/api/user/add’即可 代理后地址栏显示/
        },
      },
      '/druid': {
        target: 'http://127.0.0.1:8082', //设置调用接口地址和端口号别忘了加http
        changeOrigin: true,
        pathRewrite: {
          '^/druid': '/druid',
        },
      },
    },
  },
  chainWebpack: (config) => {
    // 1. 排除图标目录，避免被默认 svg rule 处理
    const svgRule = config.module.rule('svg');
    svgRule.exclude.add(path.resolve(__dirname, 'src/icons/svg'));

    // 2. 新增 svg-sprite-loader 规则
    config.module
      .rule('svg-sprite')
      .test(/\.svg$/)
      .include.add(path.resolve(__dirname, 'src/icons/svg'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]', // 生成的 symbol id 格式，如 icon-home
      });
  },
  configureWebpack: {
    resolve: {
      fallback: {
        path: require.resolve('path-browserify'),
      },
    },
  },
});
